<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景</title>
		<style>
			div {
				width: 1000px;
				height: 600px;
				/* 背景颜色 */
				background-color: aqua;
				/* 背景图片 */
				background-image: url(img/背景.webp);
				/* 背景图片是否重复，分x、y轴 */
				background-repeat: no-repeat;
				/* 1000px - 889px */
				/* background-position-x: 111px; */
				/* 600px - 500px */
				/* background-position-y: 100px; */
				/* 还可以设置为left/center/right */
				/* background-position: 111px 100px; */
				/* background-size: 100% 100%; */
				/* 区域滚动条 */
				overflow: scroll;
				/* 
				 local:背景图片跟随网页和内容滚动
				 scroll:背景图片在元素内固定，只随网页滚动
				 fixed:背景图片绝对固定
				 */
				background-attachment: fixed;
			}
		</style>
	</head>
	<body>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<div>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
			<p>1234567</p>
		</div>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
		<p>1234567</p>
	</body>
</html>